<template>
    <view class="noticePart" :class="styleCss" v-if="isOpen">
        <view class="middle" >

            <view class="notice-center" @click="goGuide">
            
                <view class="desc">
                    <text class="mr5">请关注公众号,接收订单配送信息</text>
                </view>

                <view class="follow-btn ml5">
                    <text> 去关注 ></text>
                </view>
            </view>

        </view>
    </view>
</template>
<script>
const app = getApp();
export default {
    props:['styleCss'],
    data () {
        return {
        
            isOpen:false,
        }
    },
    components: {},
    onShow () {

    },
    mounted (option) {

        // this.handleOpen()

    },
    methods: {
        //判断此人是否已关注了公众号
        handleOpen () {

            if(app.globalData.userId ){

                this.open = true

            }

            // this.open = false

        },
        goGuide(  ){
            
            this.$goNext('/pages/webiewpage/index')
        },

        emptyEvent () {
            return false;
        },
        videoErrorCallback: function (e) {
            
            uni.showModal({
                content: e.target.errMsg,
                showCancel: false
            })
        },
    }
}
</script>
<style scoped lang="scss">
.noticePart {
    position: fixed;
    top: 4rpx;
    width: 100%;
    // height: 1rpx;
    text-align: center;
    z-index: 10;
    &.bottom{
        bottom: 4rpx;
        top: inherit;
    }
    .middle {
        display: inline-block;
        text-align: left;
    }
    .notice-center {
        // position: absolute;
        width: 100%;
        background: rgba(59 ,62, 69,.8);
        border-radius: 6rpx;
        padding: 10rpx 20rpx;
        display: flex;
        .imgBox {
            position: relative;
            height: 66rpx;
            width: 80rpx;
            image {
                position: absolute;
                width: 160rpx;
                left: -46rpx;
                bottom: 0;
            }
        }

        .desc {
            color: rgba(255, 255, 255, 0.85);
            flex: 1;
            display: flex;
            align-items: center;
            margin-left: 10rpx;
            font-size: 26rpx;
            .big {
                color: rgba(255, 255, 255, 0.95);
                font-size: 36rpx;
                margin: 0 18rpx;
            }
        }
    }
    .right{
        position: absolute;
        right: 2rpx;
        top: 0rpx;
        height: 46rpx;
        .imgBox {
            // height: 80rpx;
            width: 80rpx;
            image {
                width: 100%;
                height: 100%;
            }
        }

        .desc {
            text-align: center;
            color: rgba(0, 0, 0, 0.85);
            font-size: 20rpx;
            line-height: 1.2;
        }
    }
}
  .follow-btn{
        float: right;
        border-radius: 4rpx;
        line-height: 1.2;
        padding: 12rpx 14rpx;
        font-size: 22rpx;
        background:  #00af63;
        color: #fff;
    }
</style>